<template>
    <div class="box exclude-word">
        <a-collapse ghost>
            <a-collapse-panel header="不想出现的词">
                <div class="input">
                    <a-input v-model:value="word" placeholder="输入不想出现在图像中的内容（例如：树木，建筑等）" show-count :maxlength="200" :bordered="false" @input="onInput" />
                </div>
            </a-collapse-panel>
        </a-collapse>
    </div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import { zhToEn } from "@/api/draw";

const word = ref("");
const emits = defineEmits(["change"]);
const onInput = async () => {
    let text = word.value;
    const reg = /[\u4e00-\u9fa5]/;
    if (reg.test(text)) {
        const { data } = await zhToEn({ text: text });
        text = data;
    }
    const command = {
        text: `-- no ${text}`,
        type: "no-word",
        close: false,
    };
    emits("change", word.value ? [command] : []);
};
</script>
